<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>局部组件</title>
    <script src="../../js/common/vue/vue.js"></script>
</head>
<body>
<div id="app">
<modle-a></modle-a>
<modle-a></modle-a>
</div>
<div id="app2">
<!-- ！！   因为这个组件是注册到 app 这个vue对象下的，所以他是个局部组件，只有在 当前vue挂载对象内起作用-->
    <!--局部组件是相对于 vue实例来讲的-->
    <modle-a></modle-a>
</div>
<script>
    const  cpnC=Vue.extend({
        template:`  <div>
                        <h2>我是modle-a组件</h2>
                    </div> `
    });
    const app = new Vue({
        el: '#app',
        components: {
                'modle-a':cpnC
        }
    });
    const ap2 = new Vue({
        el: '#app2'
    })
</script>
</body>
</html>